/* eslint-disable import/prefer-default-export */
/* eslint-disable no-unused-vars */
/* eslint-disable no-restricted-syntax */
/* eslint-disable guard-for-in */
/* eslint-disable prefer-destructuring */
/* eslint-disable class-methods-use-this */
/* eslint-disable max-classes-per-file */
import Konva from 'konva'
import KonvaUtils from '@/components/konvaUnits/utils/konvaUtils'
import { useStore } from '@/store/index'
import { PillarClass } from '@/store/pillar'

export class Pillar {
  points!: number[]

  height: number = 2000

  width: number = 1400

  color: string = 'black'

  spacing: number[] = [40, 60]

  silk: number = 0

  rotation: number = 0

  pillar!: Konva.Group

  draw(id: string, points: number[], angle: number, addStore: boolean): object {
    this.points = points
    this.rotation = angle
    const store = useStore()

    const pillarPoints = KonvaUtils.fixRadian(
      points,
      angle,
      store.pillar.diameter[0] / store.globalParam.plottingScale
    )

    this.spacing = [
      store.pillar.diameter[0] / store.globalParam.plottingScale,
      store.pillar.diameter[1] / store.globalParam.plottingScale
    ]
    this.points = [pillarPoints.points[0], pillarPoints.points[1]]

    const pillarRect = new Konva.Rect({
      id: `${id}-pillar${store.drawing.pillars.size + 1}`,
      x: this.points[0],
      y: this.points[1],
      width: this.spacing[0],
      height: this.spacing[1] * 2,
      fill: 'black',
      rotation: angle
    })

    this.pillar = new Konva.Group({
      id: `${id}-pillar${store.drawing.pillars.size + 1}`
    })
    this.pillar.add(pillarRect)
    // this.pillar.add(rect)

    if (addStore) {
      store.drawingAction.setPillar(
        `${id}-pillar${store.drawing.pillars.size + 1}`,
        new PillarClass(
          this.points,
          angle,
          store.pillar.height,
          store.pillar.diameter,
          store.pillar.color,
          store.pillar.hole
        )
      )
    }
    return {
      id: `${id}-pillar${store.drawing.pillars.size + 1}`,
      x: pillarPoints.points[0],
      y: pillarPoints.points[1],
      width: this.spacing[0],
      height: this.spacing[1] * 2,
      rotation: angle
    }
  }

  mouseover(e: any): void {}

  mouseout(e: any): void {}

  clickOn(e: any): void {}

  dbClickOn(e: any): void {
    console.log('dbClickOn', e)
  }

  remove(e: any): void {}
}
